
import QtQuick 2.6
import QtQuick.Layouts 1.2
import QtQuick.Templates 2.5 as T
import org.ukui.qqc2style.private 1.0 as StylePrivate
import QtQuick.Controls 2.5

T.MenuItem {
    id: controlRoot

//    palette: app.palette
//    font: app.font


    implicitWidth: 100 //ath.max(implicitBackgroundWidth + leftInset + rightInset,
                   //        image.width + label.width + labelLeftSpace + leftPadding + rightPadding +
                   //        (controlRoot.checkable ? /*arrow.implicitWidth*/menuItem.imageWidth + menuItem.imageSpace : 0) +
                   //        (controlRoot.subMenu != null ? /*indicator.implicitWidth*/menuItem.imageWidth + menuItem.imageSpace : 0) + itemLeftSpace)
    implicitHeight:50//visible ? Math.max(implicitBackgroundHeight + topInset + bottomInset,
                   //                   Math.max(contentItem.height,
                   //                  controlRoot.subMenu ? indicator.implicitHeight : 0) + topPadding + bottomPadding, menuItem.normalHeight) : 0

    baselineOffset: contentItem.y + contentItem.baselineOffset

//    Layout.fillWidth: true
    padding: menuItem.topBottomPadding

    property int gridUnit: fontMetrics.height
    property int labelLeftSpace: 0
    property int itemLeftSpace: (!controlRoot.checkable/* && !controlRoot.subMenu*/) ? controlRoot.leftPadding : 20 + controlRoot.leftPadding
    //property alias backColor: backrect.color

    property var bacDtColor: "red" //!controlRoot.enabled ? menuItem.disableBC :
                             //                       controlRoot.pressed ? menuItem.clickedBC :
                             //                                               controlRoot.hovered ? menuItem.hoveredBC : menuItem.normalBC

//    leftPadding: menuItem.leftRightPadding/* : Math.floor(gridUnit/4)*2*/
//    rightPadding: menuItem.leftRightPadding// Math.floor(gridUnit/4)*2
    hoverEnabled: true


//    StylePrivate.APPParameter{
//        id: appP
//    }
////    StylePrivate.UKUIButton{
////        id: btn
////    }
////    StylePrivate.UKUIMenuItem{
////        id: mItem
////    }
////    NormalControlColor{
////    id:ncColor
////    }
//    StylePrivate.ParseInterface{
//        id: parseInterface
//    }

//    function getStartColor(dtcolor)
//    {
//        return parseInterface.pStartColor(dtcolor)
//    }
//    function getEndColor(dtcolor)
//    {
//        return parseInterface.pEndColor(dtcolor)
//    }
    Shortcut {
        //in case of explicit & the button manages it by itself
        enabled: !(RegExp(/\&[^\&]/).test(controlRoot.text))

        onActivated: {
            if (controlRoot.checkable) {
                controlRoot.toggle();
            } else {
                controlRoot.clicked();
            }
        }
    }

    contentItem:Item{
        anchors.left: controlRoot.left
        anchors.leftMargin: itemLeftSpace
        anchors.right: parent.right
        anchors.rightMargin: controlRoot.rightPadding
        //implicitWidth: image.width + label.implicitWidth + labelLeftSpace
        Image {
            id: image
            source: //controlRoot.icon.source
            {
                if((controlRoot.icon.source.toString() === "" && controlRoot.icon.name.toString() === ""))
                    return controlRoot.icon.source

                var model = !controlRoot.enabled ? "disenable" : appP.isDark ? "highlight" : /*controlRoot.pressed ? "highlight" : controlRoot.hovered ? "highlight" :*/ "normal"

                let s = controlRoot.icon.source.toString()
                return "image://imageProvider/" + s + "/" + model;
            }
            anchors.verticalCenter: parent.verticalCenter
            width: (controlRoot.display !== AbstractButton.TextOnly && source !== "" && status != Image.Null) ? menuItem.imageWidth : 0
            visible: controlRoot.display !== AbstractButton.TextOnly && source !== "" && status != Image.Null
        }
        Label {
            id:label
            text: controlRoot.text
            font:controlRoot.font
            color: "blue"//getStartColor(controlRoot.enabled ? menuItem.normalTextColor : menuItem.disableTextColor)
            visible: controlRoot.display !== AbstractButton.IconOnly && text !== ""

            anchors.verticalCenter: parent.verticalCenter

            anchors.left: image.right
            anchors.leftMargin: labelLeftSpace//(image.visible && image.status !== Image.Null) ? 4 : labelLeftSpace
        }

    }

    indicator: Image {
        anchors.left: controlRoot.mirrored ?controlRoot.right : controlRoot.left
        anchors.leftMargin: controlRoot.mirrored ? - controlRoot.rightPadding -  menuItem.imageWidth : controlRoot.leftPadding

        anchors.verticalCenter: controlRoot.verticalCenter

        visible: controlRoot.checked
        source: {

            var model = "normal"
            if(controlRoot.checkable)
                if( appP.isDark /*|| controlRoot.pressed || controlRoot.hovered*/)
                    return "image://imageProvider/object-select-symbolic/highlight"

                else
                    return "image://imageProvider/object-select-symbolic/normal"
            return ""
        }
        width: menuItem.imageWidth
        height: menuItem.imageWidth
    }

    arrow: Image {
        anchors.left: controlRoot.mirrored ?controlRoot.left : controlRoot.right
        anchors.leftMargin: controlRoot.mirrored ? controlRoot.leftPadding : - controlRoot.rightPadding -  menuItem.imageWidth
        anchors.verticalCenter: parent.verticalCenter
        width: menuItem.imageWidth
        height: menuItem.imageWidth

        visible: controlRoot.subMenu
        mirror: controlRoot.mirrored
        source: {
            var model = "normal"
            if(controlRoot.subMenu)
                if( appP.isDark /*|| controlRoot.pressed || controlRoot.hovered*/)
                    return "image://imageProvider/ukui-end-symbolic/highlight"
            else
                    return "image://imageProvider/ukui-end-symbolic/normal"

            return ""
        }
    }

    background:
        Rectangle {
        id: backrect
        width: controlRoot.width
        height: controlRoot.height
        radius: menuItem.radius
        //opacity: (controlRoot.highlighted || controlRoot.hovered || controlRoot.pressed || controlRoot.checked) ? 1 : 0
        border.width: 1
        color:  controlRoot.hovered ? "red" : "yellow"
        //color: getStartColor(bacDtColor)

//        Rectangle{
//            id: gradientRec
//            anchors.fill: parent
//            radius: parent.radius
//            border.width: parent.border.width
//            border.color: parent.border.color
////            gradient:  Gradient {
////                id:gradient
////                GradientStop { position: 0.0; color: getStartColor(bacDtColor) }

////                GradientStop { position: 1.0; color: getEndColor(bacDtColor)}
////            }
//            visible: !parseInterface.isSolidPattern(bacDtColor)
//        }
    }

    onPressedChanged: {
        stateChange()
    }
    onHoveredChanged: {
        stateChange()

    }
    Component.onCompleted: {
        console.log("textttt", controlRoot.text)
        stateChange()
    }
//    onVisibleChanged: {
//        controlRoot.implicitWidth = Math.max(implicitBackgroundWidth + leftInset + rightInset,
//                                                image.width + label.width + labelLeftSpace + leftPadding + rightPadding +
//                                                (controlRoot.checkable && controlRoot.checked ? /*arrow.implicitWidth*/menuItem.imageWidth + menuItem.imageSpace : 0) +
//                                                (controlRoot.subMenu !== null ? /*indicator.implicitWidth*/menuItem.imageWidth + menuItem.imageSpace : 0) + itemLeftSpace)
//        console.log("menuitemmmmmm", label.text, controlRoot.checkable, controlRoot.checked, controlRoot.subMenu, controlRoot.implicitWidth)

//    }

    function stateChange()
    {
//        bacDtColor = !controlRoot.enabled ? menuItem.disableBC :
//                                                            controlRoot.pressed ? menuItem.clickedBC :
//                                                                                    controlRoot.hovered ? menuItem.hoveredBC : menuItem.normalBC
//        //backColor = gradientRec.visible ? "transparent" : getStartColor(bacDtColor);

//    backrect.border.color = getStartColor(!controlRoot.enabled ? menuItem.disableBorderColor :
//                                                  controlRoot.pressed ? menuItem.clickBorderColor :
//                                                  controlRoot.hovered ? menuItem.hoverBorderColor : menuItem.normalBorderColor);
    controlRoot.update()
    }
//    onVisibleChanged: {
//        if(visible){
//            var backWidth = implicitBackgroundWidth + leftInset + rightInset;
//            var itemWidth = iconLabel.width + leftPadding + rightPadding +
//                    (arrow.visible ? arrow.implicitWidth : 0) +
//                    (indicator.visible ? indicator.implicitWidth : 0)
//            width =  Math.max(backWidth, itemWidth)
//            console.log("menuitem visible..........", controlRoot.text, width, backWidth, itemWidth, iconLabel.width, implicitBackgroundWidth)

//        }
//    }
    property variant fontMetrics: TextMetrics {
        text: "M"
        function roundedIconSize(size) {
            if (size < 16) {
                return size;
            } else if (size < 22) {
                return 16;
            } else if (size < 32) {
                return 22;
            } else if (size < 48) {
                return 32;
            } else if (size < 64) {
                return 48;
            } else {
                return size;
            }
        }
    }

    StylePrivate.UKUIMenuItem{
        id: menuItem
    }

    StylePrivate.APPParameter{
        id: app
    }
}





